/* eslint-disable consistent-return */
/* eslint-disable array-callback-return */
import React from 'react';
import { connect } from 'dva';
import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import {
  Card,
  Button,
  Spin,
  Select,
  message,
  Steps,
  Input,
  Radio,
  Row,
  Col,
  InputNumber,
} from 'antd';
import router from 'umi/router';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import { urlParse } from '@/utils/utils';
import styles from '@/utils/utils.less';
import HOCSelect from '@/components/AntDesign/Select';

const { Option } = Select;
const FormItem = Form.Item;
const { Step } = Steps;
@connect(({ loading, quotation, quosetprice }) => ({
  loading: loading.models.quotation || loading.models.addemp || false,
  quotation,
  quosetprice,
}))
@Form.create()
class BasicForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      dictData: null, // 字典数据
    };
  }

  componentDidMount() {
    const {
      dispatch,
      form,
      location,
      quotation: { quotationQuery },
      quosetprice: { isGoBack = false },
    } = this.props;
    const contInfo = urlParse(decodeURI(location.search));
    if (contInfo) {
      this.setState({ ...contInfo });
    }
    // 获取页面的所有字典值
    dispatch({
      type: 'publicdata/fetchDictCode',
      payload: ['SER_TYPE', 'POS_WAY', 'YES_NO_FLAG', 'QUO_TYPE'],
    }).then(data => {
      this.setState({ dictData: data });
    });
    // 代表不是从设置价格页面来的，将数据清空
    if (!isGoBack) {
      dispatch({
        type: 'quotation/updateModelData',
        payload: {
          comType: '1', // 公司类型
          taxes: '1', // 是否含税报价
          method: '1', // 报价方式
          isSerTypeDisabled: false,
          isEntrust: false,
          isLocalDisabled: false,
        },
      });
      dispatch({
        type: 'quotation/updateQuery',
        payload: {
          sendSuppId: undefined, // 签约方
          custId: undefined, // 客户名称
          contId: undefined, // 供应商合同
          custContId: undefined,
          quoName: undefined, // 报价单名称
          pdId: undefined, // 产品id
          serType: undefined, // 服务类型
          taxRatio: '0.001', // 填写的税率
        },
      });
      dispatch({
        type: 'quotation/updateModelData',
        payload: {
          supplyList: [], // 签约方列表
          customerNameList: [], // 客户名称列表
          supplyContList: [], // 供应商合同列表
          contList: [], // 本地--商务合同列表
          productList: [], // 产品列表数据
          productDataAll: [], // 打包的产品数据
          suppList: [
            {
              // 打包产品列表
              id: new Date().getTime(),
              listQuoPd: [],
            },
          ],
          proarridList: [], // 部分打包产品列表
          childproarr: [], // 子打包产品
          packList: [],
        },
      });
      // 获取当前角色所在公司对应的平台供应商
      dispatch({
        type: 'addemp/plasuppList',
        payload: {},
        callback: response => {
          if (response.success && response.data) {
            dispatch({
              type: 'quotation/updateModelData',
              payload: {
                suppIds: response.data[0].suppId,
                suppReplaceCorpId: quotationQuery.sendSuppId || response.data[0].suppId,
              },
            });
            // 签约方(供应商)列表
            dispatch({
              type: 'addemp/contractParty',
              payload: { name: null, status: 2 },
              callback: r => {
                if (r.success && r.data) {
                  dispatch({
                    type: 'quotation/updateModelData',
                    payload: { supplyList: r.data },
                  });

                  for (let index = 0; index < r.data.length; index += 1) {
                    const item = r.data[index];
                    if (contInfo && contInfo.comType === '1') {
                      if (response.data[0].suppId === item.suppId) {
                        form.setFieldsValue({
                          sendSuppId: quotationQuery.sendSuppId || item.suppId,
                        });
                        // this.setState({
                        //   suppId: item.suppId,
                        // });
                        // 合同管理入口，本地（客服）
                        dispatch({
                          type: 'quotation/getInfoCust',
                          payload: {
                            custId: contInfo.custId,
                            suppId: item.suppId,
                          },
                          callback: result => {
                            if (result.success && result.data) {
                              const customerNameList = []; // 客户名称列表
                              const contList = []; // 商务合同列表
                              customerNameList.push({
                                custId: contInfo.custId,
                                name: contInfo.custName,
                              });
                              contList.push({
                                contId: contInfo.contId,
                                contName: contInfo.contName,
                              });
                              dispatch({
                                type: 'quotation/updateModelData',
                                payload: {
                                  customerNameList,
                                  contList,
                                  serType: contInfo.serType,
                                  comType: '1',
                                },
                              });
                              form.setFieldsValue({
                                custId: contInfo.custId,
                                contId: contInfo.contId,
                                serType: contInfo.serType,
                              });
                              dispatch({
                                type: 'quotation/updateModelData',
                                payload: {
                                  isLocalDisabled: true,
                                  comType: '1',
                                },
                              });
                            } else {
                              message.warning(`${result.message || '暂无数据！'}`);
                            }
                          },
                        });
                      }
                    } else if (contInfo && contInfo.comType === '2') {
                      // 合同管理入口， 全国 （供应商）
                      // 签约方的默认值
                      if (item.suppId === contInfo.suppId) {
                        form.setFieldsValue({
                          sendSuppId: item.suppId || quotationQuery.sendSuppId,
                        });
                        // this.setState({
                        //   suppId: item.suppId,
                        // });
                        // 获取供应商合同列表
                        dispatch({
                          type: 'addemp/getNameList',
                          payload: {
                            suppId: contInfo.suppId,
                          },
                          callback: result => {
                            if (result.success && result.data.length) {
                              dispatch({
                                type: 'quotation/updateModelData',
                                payload: {
                                  supplyContList: result.data,
                                  serType: '1',
                                  comType: '2',
                                },
                              });
                              form.setFieldsValue({
                                contId: result.data[0].contId,
                              });
                            } else {
                              message.warning('暂无供应商合同列表');
                            }
                          },
                        });
                        // 获取供应商下的客户名称列表
                        dispatch({
                          type: 'addemp/getCustnameList',
                          payload: {
                            contId: contInfo.contId,
                          },
                          callback: result => {
                            if (result.success && result.data.length) {
                              dispatch({
                                type: 'quotation/updateModelData',
                                payload: {
                                  customerNameList: result.data,
                                  serType: '1',
                                  comType: '2',
                                },
                              });
                              form.setFieldsValue({
                                custId: result.data[0].custId,
                              });
                            } else {
                              message.warning('该供应商合同下无客户！');
                            }
                          },
                        });
                        form.setFieldsValue({
                          serType: '1',
                        });
                        dispatch({
                          type: 'quotation/updateModelData',
                          payload: {
                            isEntrust: true,
                            comType: '2',
                          },
                        });
                      }
                    } else if (response.data[0].suppId === item.suppId) {
                      form.setFieldsValue({
                        sendSuppId: quotationQuery.sendSuppId || item.suppId,
                      });
                      // this.setState({
                      //   suppId: item.suppId,
                      // });
                      this.getCustomers(item.suppId); // 本地 请求客户名称
                    }
                  }
                } else {
                  message.warning(`${r.message || '暂无数据！'}`);
                }
              },
            });
          }
        },
      });
      // 选择产品数据
      dispatch({
        type: 'quotation/getPdInfoList',
        payload: {},
        callback: res => {
          if (res.success && res.data) {
            dispatch({
              type: 'quotation/updateModelData',
              payload: { productList: res.data },
            });
          } else {
            message.warning(`${res.message || '暂无数据！'}`);
          }
        },
      });
    }
  }

  componentWillUnmount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'quoupdate/updateModelData',
      payload: { isGoBack: false },
    });
    dispatch({
      type: 'quosetprice/updateModelData',
      payload: { isGoBack: false },
    });
  }

  // 选择签约方为本地：请求客户名称
  getCustomers = suppId => {
    const { dispatch } = this.props;
    dispatch({
      type: 'addemp/customerList',
      payload: { suppId },
      callback: response => {
        if (response.success && response.data.length) {
          dispatch({
            type: 'quotation/updateModelData',
            payload: { customerNameList: response.data },
          });
        } else {
          message.warning('该签约方下暂无客户！');
        }
      },
    });
  };

  // 签约方选择 : 根据选择显示不同
  selectCompany = suppId => {
    const { form, dispatch, quotation } = this.props;
    form.resetFields(['custId', 'contId', 'custContId', 'serType']);
    dispatch({
      type: 'quotation/updateQuery',
      payload: {
        sendSuppId: suppId,
        custId: undefined,
        contId: undefined,
        custContId: undefined,
      },
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        customerNameList: [],
        supplyContList: [],
      },
    });
    if (suppId === quotation.suppIds) {
      this.getCustomers(suppId); // 本地  请求客户名称
      dispatch({
        type: 'quotation/updateModelData',
        payload: {
          isSerTypeDisabled: false,
          isEntrust: false,
          comType: '1',
        },
      });
    } else {
      this.getSupplyers(suppId); // 全国 请求供应商合同
      dispatch({
        type: 'quotation/updateModelData',
        payload: {
          isSerTypeDisabled: false,
          isEntrust: true,
          comType: '2',
        },
      });
      form.setFieldsValue({ serType: '1' });
    }
    // this.setState({ suppId });
  };

  // 根据签约方为全国：请求供应商合同
  getSupplyers = suppId => {
    const { dispatch } = this.props;
    dispatch({
      type: 'addemp/getNameList',
      payload: { suppId, queryType: 3 },
      callback: response => {
        if (response.success && response.data.length) {
          dispatch({
            type: 'quotation/updateModelData',
            payload: { supplyContList: response.data },
          });
        } else {
          message.warning('暂无供应商合同列表');
        }
      },
    });
  };

  // 选择客户名称：请求商务合同
  selectCustomers = custId => {
    const { form, dispatch } = this.props;
    form.resetFields(['contId', 'serType']);
    dispatch({
      type: 'quotation/updateQuery',
      payload: {
        contId: undefined, // 供应商合同
        custContId: undefined,
        serType: undefined, // 服务类型
      },
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: { supplyContList: [], custId, contList: [], isSerTypeDisabled: false },
    });
    dispatch({
      type: 'addemp/getBusiness',
      payload: { custId, queryType: 3 },
      callback: response => {
        if (response.success && response.data.length) {
          dispatch({
            type: 'quotation/updateModelData',
            payload: { contList: response.data },
          });
        } else {
          message.warning('该客户名称下暂无商务合同！');
        }
      },
    });
  };

  // 根据选择的供应商合同：请求客户名称
  selectSupply = (contId, options) => {
    const { dispatch, form } = this.props;
    if (options.props.state === 3) {
      message.warning('该供应商合同已到期！');
    }
    // this.setState({
    //   suppContId: contId,
    // });
    form.resetFields(['custId']);
    dispatch({
      type: 'quotation/updateQuery',
      payload: {
        custId: undefined,
      },
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: { customerNameList: [] },
    });
    dispatch({
      type: 'addemp/getCustnameList',
      payload: { contId },
      callback: response => {
        if (response.success && response.data.length) {
          dispatch({
            type: 'quotation/updateModelData',
            payload: { customerNameList: response.data },
          });
        } else {
          message.warning('该供应商合同下无客户！');
        }
      },
    });
  };

  // 选择商务合同:设置服务类型
  selectCont = custContId => {
    const { dictData } = this.state;
    const {
      quotation: { contList },
      form,
      dispatch,
    } = this.props;
    contList.forEach(custCont => {
      if (custCont.contId === custContId) {
        dictData.SER_TYPE.forEach(serverType => {
          if (custCont.serType === Number(serverType.itemCode)) {
            form.setFieldsValue({ serType: serverType.itemCode });
            dispatch({
              type: 'quotation/updateModelData',
              payload: { isSerTypeDisabled: true },
            });
          }
        });
      }
    });
  };

  // 选择产品
  selectProducts = proArr => {
    const {
      quotation: { productList, suppList },
      dispatch,
      form,
    } = this.props;
    const newData = productList.map(item => ({ ...item }));
    const newProductDate = []; // 匹配到的产品
    newData.map(item => {
      proArr.map(itm => {
        if (item.pdId === itm) {
          newProductDate.push(item);
        }
      });
    });
    const suppIdList = [];
    suppList.map((sitem, sindex) => {
      const arr3 = [];
      for (let i = 0; i < sitem.listQuoPd.length; i += 1) {
        if (proArr.indexOf(sitem.listQuoPd[i]) > -1) {
          arr3.push(sitem.listQuoPd[i]);
        }
      }
      form.setFieldsValue({ [`listQuoPd_${sindex}`]: arr3 });
      suppIdList.push({
        listQuoPd: arr3,
        id: sindex,
      });
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        productDataAll: newProductDate,
        suppList: suppIdList,
      },
    });
  };

  // 是否含税(切换)
  changeTaxes = e => {
    const { dispatch } = this.props;
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        taxes: e.target.value,
      },
    });
  };

  // 报价方式(切换)
  changeMethod = e => {
    const { dispatch } = this.props;
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        method: e.target.value,
        suppList: [
          {
            // 打包产品列表
            id: new Date().getTime(),
            listQuoPd: [],
          },
        ],
      },
    });
  };

  // 子打包产品
  changeBundle = (proArr, id) => {
    const {
      dispatch,
      quotation: { childproarr, suppList },
    } = this.props;
    const arraypro = [];
    const temp = [];
    proArr.map(item => {
      arraypro.push(item);
      childproarr.push(item);
    });

    for (let i = 0; i < childproarr.length; i += 1) {
      if (temp.indexOf(childproarr[i]) === -1) {
        temp.push(childproarr[i]);
      }
    }
    for (let i = 0; i < arraypro.length; i += 1) {
      if (temp.indexOf(arraypro[i]) === -1) {
        temp.push(arraypro[i]);
      }
    }
    suppList.map(items => {
      const obj = items;
      if (items.id === id) {
        obj.listQuoPd = proArr;
      }
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        childproarr,
        suppList,
      },
    });
  };

  // 添加分组
  addList = () => {
    const {
      dispatch,
      quotation: { suppList },
    } = this.props;
    const newData = suppList.map(item => ({ ...item }));
    newData.push({
      id: new Date().getTime(),
      listQuoPd: [],
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        suppList: newData,
      },
    });
  };

  // 删除分组
  deleteContact = currentIndex => {
    const {
      dispatch,
      quotation: { suppList },
    } = this.props;
    const newData = suppList.map(item => ({ ...item })); // 删除其中一条数据
    const newSuppList = [];
    newData.map(item => {
      if (item.id !== currentIndex) {
        newSuppList.push(item);
      }
    });
    dispatch({
      type: 'quotation/updateModelData',
      payload: {
        suppList: newSuppList,
      },
    });
  };

  // 下一步
  nextStep = () => {
    const {
      form,
      quotation: { suppList, method },
      dispatch,
    } = this.props;
    form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        const packList = [];
        const packArray = []; // 选中的打包产品
        suppList.map(item => {
          //  1不打包，2部分打包，3全部打包
          if (method === '1') {
            const { pdId } = values;
            pdId.map(itm => {
              packList.push({
                listQuoPd: [itm],
              });
            });
          } else if (method === '3') {
            const { pdId } = values;
            packList.push({
              listQuoPd: pdId,
            });
          } else if (method === '2') {
            packList.push({
              listQuoPd: values[`listQuoPd_${item.id}`],
            });
          }
          if (method === '2') {
            packArray.push(values[`listQuoPd_${item.id}`]);
          }
        });
        if (method === '2') {
          // 选择打包产品时，将剩余的产品放在一个包中
          // eslint-disable-next-line prefer-spread
          const packArrays = [].concat.apply([], packArray);
          const newPacks = values.pdId.filter(i => packArrays.indexOf(i) === -1);
          if (newPacks.length) {
            newPacks.forEach(item => {
              packList.push({
                listQuoPd: [item],
              });
            });
          }
        }
        if (packList.length > 0) {
          // 转格式listQuoPd:[{paid:'1'},{pdid:'2'}]
          packList.map(item => {
            let newObject = {};
            const newPackList = [];
            const temp = item;
            if (item.listQuoPd) {
              item.listQuoPd.map(itm => {
                newObject = {
                  pdId: itm,
                };
                newPackList.push(newObject);
              });
              temp.listQuoPd = newPackList;
            }
          });
        }
        const submitData = {
          suppId: values.sendSuppId, // 签约方
          custId: values.custId, // 客户名称
          custContId: values.contId, // 商务合同
          serType: values.serType, // 服务类型
          taxFlag: values.taxFlag, // 是否含税报价
          taxRatio: values.taxRatio, // 税率
          quoName: values.quoName, // 报价单名称
          quoType: values.quoType, // 报价方式
          pdId: values.pdId, // 选择产品
          packList,
        };
        const zpacList = [];
        const newplacList = [];
        packList.map(itempack => {
          zpacList.push(itempack.listQuoPd);
        });
        zpacList.map(letitem => {
          letitem.map(itemlast => {
            newplacList.push(itemlast.pdId);
          });
        });

        const temp = {};
        const r = [];
        const len = newplacList.length;
        let val;
        let type;
        for (let i = 0; i < len; i += 1) {
          val = newplacList[i];
          type = typeof val;
          if (!temp[val]) {
            temp[val] = [type];
            r.push(val);
          } else {
            return message.warning('不能选择重复的产品');
          }
        }
        // 校验报价单名称的重复
        dispatch({
          type: 'quotation/getCheckName',
          payload: {
            quoName: values.quoName,
            custId: values.custId,
          },
          callback: response => {
            if (response.success) {
              window.localStorage.setItem('quotationadd', JSON.stringify(submitData));
              dispatch({
                type: 'quotation/updateQuery',
                payload: { ...submitData },
              });
              // 组装打包产品
              suppList.map((item, index) => {
                const newSuppList = [];
                packList[index].listQuoPd.map(value => {
                  newSuppList.push(value.pdId);
                });
                suppList[index].listQuoPd = newSuppList;
              });
              dispatch({
                type: 'quotation/updateModelData',
                payload: {
                  packList,
                  suppList,
                  isSerTypeDisabled: true, // 服务类型
                  isEntrust: true, // 供应商合同默认委托，不可更改
                  isLocalDisabled: true, // 本地客户入口 服务类型 不可更改
                },
              });
              router.push('/salemanage/quotation/setprice');
            } else {
              message.warning(`${response.message || '报价单名称已存在！'}`);
            }
          },
        });
      }
    });
  };

  render() {
    const { dictData } = this.state;
    const {
      form: { getFieldDecorator },
      loading,
      quotation: {
        quotationQuery,
        supplyList,
        customerNameList,
        supplyContList,
        contList,
        productList,
        taxes,
        method,
        suppList,
        productDataAll,
        isSerTypeDisabled,
        isEntrust,
        isLocalDisabled,
        comType,
      },
    } = this.props;
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 9 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 12 },
        md: { span: 7 },
      },
    };
    const formItemLayouts = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 11 },
        md: { span: 11 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 12 },
        md: { span: 12 },
      },
    };
    const Test = () => (
      <span style={{ display: 'inline-block', width: 200 }}>请输入小数点不超过3位的数字</span>
    );
    const SelelctCust = () => {
      if (comType && comType === '1') {
        return (
          <div>
            <FormItem {...formItemLayout} label="客户名称">
              {getFieldDecorator('custId', {
                rules: [{ required: true, message: '请选择' }],
                initialValue: quotationQuery.custId,
              })(
                <HOCSelect
                  placeholder="请选择"
                  onSelect={this.selectCustomers}
                  showSearch
                  optionFilterProp="children"
                >
                  {customerNameList.map(one => (
                    <Option key={one.custId} value={one.custId}>
                      {one.name}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
            <FormItem {...formItemLayout} label="商务合同">
              {getFieldDecorator('contId', {
                rules: [{ required: true, message: '请选择' }],
                initialValue: quotationQuery.contId || quotationQuery.custContId,
              })(
                <HOCSelect
                  placeholder="请选择"
                  onSelect={(value, options) => this.selectCont(value, options)}
                  showSearch
                  optionFilterProp="children"
                >
                  {contList.map(one => (
                    <Option key={one.contId} value={one.contId} state={one.contState}>
                      {one.contName}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
            <FormItem {...formItemLayout} label="服务类型">
              {getFieldDecorator('serType', {
                rules: [{ required: true, message: '请选择' }],
                initialValue: quotationQuery.serType,
              })(
                <HOCSelect
                  placeholder="请输入关键字检索"
                  showSearch
                  optionFilterProp="children"
                  disabled={isSerTypeDisabled || isEntrust || isLocalDisabled}
                >
                  {dictData &&
                    dictData.SER_TYPE.map(one => (
                      <Option key={one.itemCode}>{one.itemName}</Option>
                    ))}
                </HOCSelect>
              )}
            </FormItem>
          </div>
        );
      }
      if (comType && comType !== '1') {
        return (
          <div>
            <FormItem {...formItemLayout} label="供应商合同">
              {getFieldDecorator('contId', {
                rules: [{ required: true, message: '请选择' }],
                initialValue: quotationQuery.contId || quotationQuery.custContId,
              })(
                <HOCSelect
                  placeholder="请选择"
                  onSelect={(value, options) => this.selectSupply(value, options)}
                  showSearch
                  optionFilterProp="children"
                >
                  {supplyContList.map(one => (
                    <Option key={one.contId} value={one.contId} state={one.contState}>
                      {one.contName}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
            <FormItem {...formItemLayout} label="客户名称">
              {getFieldDecorator('custId', {
                rules: [{ required: true, message: '请选择' }],
                initialValue: quotationQuery.custId,
              })(
                <HOCSelect placeholder="请选择" showSearch optionFilterProp="children">
                  {customerNameList.map(one => (
                    <Option key={one.custId} value={one.custId}>
                      {one.name}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
            <FormItem {...formItemLayout} label="服务类型">
              {getFieldDecorator('serType', {
                rules: [{ required: true, message: '请选择' }],
                initialValue: quotationQuery.serType,
              })(
                <HOCSelect
                  placeholder="请输入关键字检索"
                  showSearch
                  optionFilterProp="children"
                  disabled={isEntrust}
                >
                  {dictData &&
                    dictData.SER_TYPE.map(one => (
                      <Option key={one.itemCode}>{one.itemName}</Option>
                    ))}
                </HOCSelect>
              )}
            </FormItem>
          </div>
        );
      }
      return null;
    };
    return (
      <Form>
        <PageHeaderWrapper wrapperClassName={styles.advancedForm}>
          <Spin tip="Loading..." spinning={loading}>
            <Card>
              <Steps current={0} style={{ marginBottom: 70 }}>
                <Step title="选择产品" />
                <Step title="设置价格" />
                <Step title="完成" />
              </Steps>
              <FormItem {...formItemLayout} label="签约方">
                {getFieldDecorator('sendSuppId', {
                  rules: [{ required: true, message: '请选择' }],
                  initialValue: quotationQuery.sendSuppId || quotationQuery.suppId,
                })(
                  <HOCSelect
                    placeholder="请选择"
                    onSelect={this.selectCompany}
                    showSearch
                    optionFilterProp="children"
                  >
                    {supplyList.map(one => (
                      <Option key={one.suppId} value={one.suppId}>
                        {one.name}
                      </Option>
                    ))}
                  </HOCSelect>
                )}
              </FormItem>
              <SelelctCust />
              <FormItem {...formItemLayout} label="报价单名称">
                {getFieldDecorator('quoName', {
                  rules: [{ required: true, message: '请输入' }],
                  initialValue: quotationQuery.quoName,
                })(<Input placeholder="请输入" maxLength={100} />)}
              </FormItem>
              <FormItem {...formItemLayout} label="选择产品">
                {getFieldDecorator('pdId', {
                  rules: [{ required: true, message: '请选择' }],
                  initialValue: quotationQuery.pdId,
                })(
                  <HOCSelect onChange={this.selectProducts} placeholder="请选择" mode="multiple">
                    {productList.map(one => (
                      <Option key={one.pdId} value={one.pdId} datas={one}>
                        {one.pdName}{' '}
                      </Option>
                    ))}
                  </HOCSelect>
                )}
              </FormItem>
              <Row gutter={24} style={{ marginLeft: 0, marginRight: '-25px' }}>
                <Col span={6} offset={6} style={{ position: 'relative' }}>
                  <FormItem {...formItemLayouts} label="是否含税报价">
                    {getFieldDecorator('taxFlag', {
                      initialValue: taxes,
                      rules: [{ required: false, message: '请选择' }],
                    })(
                      <Radio.Group onChange={this.changeTaxes}>
                        {dictData &&
                          dictData.YES_NO_FLAG.map(options => (
                            <Radio key={options.itemCode} value={options.itemCode}>
                              {options.itemName}
                            </Radio>
                          ))}
                      </Radio.Group>
                    )}
                  </FormItem>
                  <Col span={5} style={{ position: 'absolute', top: 0, right: 0 }}>
                    {taxes === '2' ? (
                      <FormItem>
                        {getFieldDecorator('taxRatio', {
                          rules: [
                            {
                              required: true,
                              message: <Test />,
                              pattern: /^-?\d+\.?\d{0,3}$/,
                            },
                          ],
                          initialValue: quotationQuery.taxRatio,
                        })(
                          <InputNumber
                            placeholder="填写税率"
                            min={0.001}
                            max={100}
                            style={{ width: 100 }}
                            formatter={value => `${value}%`}
                            parser={value => value.replace('%', '')}
                          />
                        )}
                      </FormItem>
                    ) : null}
                  </Col>
                </Col>
              </Row>
              <FormItem {...formItemLayout} label="报价方式">
                {getFieldDecorator('quoType', {
                  initialValue: method,
                  rules: [{ required: false, message: '请选择' }],
                })(
                  <Radio.Group onChange={this.changeMethod}>
                    {dictData &&
                      dictData.QUO_TYPE.sort((a, b) => a.itemCode - b.itemCode).map(options => (
                        <Radio key={options.itemCode} value={options.itemCode}>
                          {options.itemName}
                        </Radio>
                      ))}
                  </Radio.Group>
                )}
              </FormItem>
              {method === '2' ? (
                <div>
                  {suppList.map((item, index) => (
                    <Row key={item.id}>
                      <Col span={12} offset={6}>
                        <FormItem wrapperCol={{ md: { span: 14, offset: 6 } }} key={item.id}>
                          {getFieldDecorator(`listQuoPd_${item.id}`, {
                            rules: [{ required: true, message: '请选择' }],
                            initialValue: item.listQuoPd,
                          })(
                            <HOCSelect
                              onChange={value => {
                                this.changeBundle(value, item.id);
                              }}
                              placeholder="请选择"
                              mode="multiple"
                              style={{}}
                            >
                              {productDataAll.map(one => (
                                <Option key={one.pdId} value={one.pdId} datas={one}>
                                  {one.pdName}{' '}
                                </Option>
                              ))}
                            </HOCSelect>
                          )}
                        </FormItem>
                      </Col>
                      <Col span={1}>
                        {index === 0 ? null : (
                          <MinusCircleOutlined
                            style={{ lineHeight: '39px', marginLeft: '-60px', fontSize: 18 }}
                            className="dynamic-delete-button"
                            onClick={() => this.deleteContact(item.id)}
                          />
                        )}
                      </Col>
                    </Row>
                  ))}
                  <FormItem wrapperCol={{ md: { span: 7, offset: 9 } }}>
                    <Button
                      style={{ width: '100%', marginTop: 15, marginBottom: 8, textAlign: 'center' }}
                      type="dashed"
                      icon={<PlusOutlined />}
                      onClick={this.addList}
                    >
                      添加分组
                    </Button>
                  </FormItem>
                </div>
              ) : null}
              <div style={{ marginTop: '100px', marginBottom: '30px', textAlign: 'center' }}>
                <Button
                  style={{ marginRight: '30px' }}
                  size="large"
                  onClick={() => router.push('/salemanage/quotation/index')}
                >
                  上一步
                </Button>
                <Button size="large" type="primary" onClick={this.nextStep}>
                  下一步
                </Button>
              </div>
            </Card>
          </Spin>
        </PageHeaderWrapper>
      </Form>
    );
  }
}

export default BasicForm;
